<!DOCTYPE html>
<html lang="en">
    <head>
        <meta charset="UTF-8" />
        <meta http-equiv="X-UA-Compatible" content="IE=edge" />
        <meta name="viewport" content="width=device-width, initial-scale=1.0" />
        <title>Document</title>
        <!-- 引入css -->
        <link rel="stylesheet" href="../assets/lib/layui/css/layui.css" />
        <link rel="stylesheet" href="../assets/css/article/art_cate.css" />
    </head>
    <body>
        <div class="layui-card">
            <div class="layui-card-header" id="card-header">
                <span>文章类别管理</span>

                <button
                    type="button"
                    class="layui-btn layui-btn-normal layui-btn-sm"
                    id="btnAddCate"
                >
                    添加分类
                </button>
            </div>
            <div class="layui-card-body">
                <table class="layui-table">
                    <colgroup>
                        <col width="150" />

                        <col />
                        <col />
                        <col width="200" />
                    </colgroup>
                    <thead>
                        <tr>
                            <th>序号</th>
                            <th>分类名称</th>
                            <th>分类别名</th>
                            <th>操作</th>
                        </tr>
                    </thead>
                    <tbody></tbody>
                </table>
            </div>
        </div>
        <!-- 定义模板 -->
        <script type="text/html" id="ple-cate">
            {{each data}}
            <tr>
                <td>{{$index+1}}</td>
                <td>{{$value.cate_name}}</td>
                <td>{{$value.cate_alias}}</td>
                <td>
                    <button
                        type="button"
                        class="layui-btn layui-btn-xs"
                        id="btnEdit"
                        data-id="{{$value.id}}"
                    >
                        修改
                    </button>
                    <button
                        type="button"
                        class="layui-btn layui-btn-xs layui-btn-danger"
                        id="btn-del"
                        data-id="{{$value.id}}"
                    >
                        删除
                    </button>
                </td>
            </tr>
            {{/each}}
        </script>

        <!-- 修改分类弹出框内容 -->
        <script type="text/html" id="btnEditList">
            <form class="layui-form" id="formEdit" lay-filter="layui-form">
                <input type="hidden" name="id" />
                <div class="layui-form-item">
                    <label class="layui-form-label">分类名称</label>
                    <div class="layui-input-block">
                        <input
                            type="text"
                            name="cate_name"
                            required
                            lay-verify="required"
                            placeholder="请输入分类名称"
                            autocomplete="off"
                            class="layui-input"
                        />
                    </div>
                </div>
                <div class="layui-form-item">
                    <label class="layui-form-label">分类别名</label>
                    <div class="layui-input-block">
                        <input
                            type="text"
                            name="cate_alias"
                            required
                            lay-verify="required"
                            placeholder="请输入分类别名"
                            autocomplete="off"
                            class="layui-input"
                        />
                    </div>
                </div>
                <div class="layui-form-item">
                    <div class="layui-input-block">
                        <button class="layui-btn" lay-submit lay-filter="formDemo">确认修改</button>
                    </div>
                </div>
            </form>
        </script>
        <script type="text/html" id="btnAddList">
            <form class="layui-form" action="" id="formAdd">
                <div class="layui-form-item">
                    <label class="layui-form-label">分类名称</label>
                    <div class="layui-input-block">
                        <input
                            type="text"
                            name="cate_name"
                            required
                            lay-verify="required"
                            placeholder="请输入分类名称"
                            autocomplete="off"
                            class="layui-input"
                        />
                    </div>
                </div>
                <div class="layui-form-item">
                    <label class="layui-form-label">分类别名</label>
                    <div class="layui-input-block">
                        <input
                            type="text"
                            name="cate_alias"
                            required
                            lay-verify="required"
                            placeholder="请输入分类别名"
                            autocomplete="off"
                            class="layui-input"
                        />
                    </div>
                </div>
                <div class="layui-form-item">
                    <div class="layui-input-block">
                        <button class="layui-btn" lay-submit lay-filter="formDemo">确认添加</button>
                        <button type="reset" class="layui-btn layui-btn-primary">重置</button>
                    </div>
                </div>
            </form>
        </script>
        <script src="../assets/lib/jquery.js"></script>
        <script src="../assets/lib/layui/layui.all.js"></script>
        <script src="../assets/lib/template-web.js"></script>
        <script src="../assets/js/baseAdd.js"></script>
        <script src="../assets/js/article/art_cate.js"></script>
    </body>
</html>
